<?php get_header(); ?>

<script src="<?php bloginfo('template_url') ?>/js/jquery-1.8.1.min.js"></script>
<script src="<?php bloginfo('template_url') ?>/js/jquery.onebyone.min.js"></script>
<script src="<?php bloginfo('template_url') ?>/js/jquery.touchwipe.min.js"></script>

<script type="text/javascript" charset="utf-8">	
  $(document).ready(function() { 
    $('#banner').oneByOne({
      className: 'slideshow',	  
      sliderClassName: 'slide',
      // width: 940,
      // height: 310,
      easeType: 'random',
      slideShow: true,
      showButton: false
    });  
    
    $('.slideshow-prevbtn').click(function(){
      $('.prevArrow').trigger('click');
    });
    
    $('.slideshow-nextbtn').click(function(){
      $('.nextArrow').trigger('click');
    });
  });
</script> 

<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/jquery.onebyone.css" type="text/css" />
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/animate.css" type="text/css" />

<div class="slideshow-prevbtn"></div>
<div class="slideshow-nextbtn"></div>

<div id="banner">
  <?php
    $args = array(
      'category' => 18,
      'numberposts' => -1
    );
    
    $posts = get_posts($args);
    foreach($posts as $post){
    $feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
  ?>

  <div class="slide">
    <div class="pic-container" data-animate="lightSpeedIn" style="background: url(<?php echo $feat_image; ?>) no-repeat; background-position: center center;">
      <!--<img src="<?php echo $feat_image; ?>" />-->
    </div>
    
    <!--
    <div class="slide-info">
    -->
      <h1 data-animate="bounceIn"><?php echo $post->post_title; ?></h1>
      
      <div class="slide-info-content" data-animate="bounceIn" >
        <?php echo wpautop($post->post_content); ?>
      </div>
      
      <?php if(get_field('discount', $post->ID)){ ?>
      <div class="discount" data-animate="bounceIn">
        <h2>DISC <?php the_field('discount', $post->ID); ?></h2>
        
        <?php if(get_field('discount_description', $post->ID)){ ?>
        <p><?php the_field('discount_description', $post->ID); ?></p>
        <?php } ?>
      </div>
      <?php } ?>
    <!--</div>-->
  </div>
  
  <?php } ?>
</div>

<div class="quote">
  <img src="<?php bloginfo('template_url') ?>/images/quote.png" />
</div>
<hr />

<div class="grid grid2">
  <?php
    $id = 11;
    $post = get_post($id);
  ?>
  <h2><a href="<?php echo get_permalink($id); ?>"><?php echo $post->post_title; ?></a></h2>
  <?php echo wpautop($post->post_content); ?>
  
  <a href="<?php echo get_permalink($id) ?>" class="btn fl" style="margin-top: 20px;">Baca lebih lanjut &raquo;</a>
</div>

<div class="grid grid1">
  <?php
    $id = 15;
    $post = get_post($id);
  ?>
  <h2><a href="<?php echo get_permalink($id); ?>"><?php echo $post->post_title; ?></a></h2>
  <?php echo wpautop($post->post_content); ?>
</div>
<div class="clear"></div>

<?php get_footer(); ?>